<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telphone=no, email=no">
    <meta name="x5-fullscreen" content="true">
    <meta name="x5-orientation" content="portrait">
    <meta name="x5-page-mode" content="app">
    <meta name="full-screen" content="yes">
    <meta name="screen-orientation" content="portrait">
    <meta name="browsermode" content="application">
    <meta name="HandheldFriendly" content="true">
    <!-- <link rel="icon" href="/favicon.ico"> -->
    <title>我的跑跑</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/main.css" rel="stylesheet">
</head>

<body data-page="index">
    <!-- 顶部开始 -->
    <nav class="navbar navbar-orange navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
            <div class="nav-left">
                <img class="icon return" src="img/v3/return.png">
            </div>

            <div class="nav-title">
                <div class="title-text">我的跑跑</div>
            </div>

            <div class="nav-right">
                <img class="icon date" src="img/v3/date.png">
            </div>
        </div>
      </div>
    </nav>
    <!-- /顶部结束 -->



    <!-- 数据展示区开始 -->
    <div class="container-fluid data-container">
        <!-- 个人信息 -->
        <div class="my-info container-fluid">
            <div class="row">
                <div class="avatar-nickname col-xs-6">
                    <img src="img/avatar.png">
                    <span class="name">奔跑的敏敏</span>
                </div>
                <div class="level col-xs-6 ta-r">
                    <div class="level-info">LV 10</div>
                    <div class="level-progress progress fr">
                        <span class="progress-value">65%</span>
                        <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100" style="width: 65%;">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <!-- 分享 -->
        <div class="share container-fluid">
            <div class="row">
                <div class="col-xs-12 ta-r">
                    <img class="icon share" src="img/v3/share.png">
                </div>
            </div>
        </div>
        
        <!-- 人物 -->
        <div class="man-and-bubble container-fluid">
            <!-- 气泡 -->
            <div class="bubble">
                
            </div>
            <!-- 主体 -->
            <img class="man hide" src="img/v3/man.png">
        </div>
        
        <!-- 对话 -->
        <div class="conversation">
            <p>再跑<span class="number">10</span>km，让我变身！</p>
        </div>
    </div>
    <!-- /数据展示区结束 -->



    <!-- 底部开始 -->
    <footer class="footer navbar-fixed-bottom">
        <div class="frame container-fluid">
            <div class="row">
                <div class="frame-child col-xs-12">
                    <div class="text-main-buttom">开始跑步</div>
                    <img class="icon go-running" src="img/v3/run_bg.png">
                </div>
            </div>
        </div>
    </footer>
    <!-- /底部结束 -->



<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/highcharts.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>